<template>
  <div class="cmp-differential-diagnosis inline-block">
    <el-button
      @click="diaglogVisible = true"
      class="diagnostic-notice"
      type="danger"
    >
      鉴别诊断
    </el-button>

    <el-dialog
      title="鉴别诊断"
      custom-class="differential-diagnosis-dialog"
      v-model="diaglogVisible"
      :append-to-body="true"
    >
      <div>
        <el-collapse v-model="activeName" accordion>
          <el-collapse-item title="1. 哮喘在什么年龄起病？" name="1">
            <p>- 出生时或婴儿早期起病，提示先天结构异常。</p>
            <p>
              -
              先天性隔疝通常可经产前超声检测出，血管环或其他血管异常，可导致生命早期喘息或其他呼吸系统症状
            </p>
            <p>- &lt;2岁的婴儿易感下呼吸道感染，毛细支气管炎</p>
            <p>- 青少年更易患哮喘或者是非典型性的病原体如肺炎支原体</p>
          </el-collapse-item>
          <el-collapse-item title="2. 喘息是新发症状还是反复发作？" name="2">
            <p>
              -
              既往健康的婴儿首次发作喘息，并伴随上呼吸道感染的症状，常常提示毛细支气管炎
            </p>
            <p>
              -
              突然发生的喘息也是过敏反应的特征，尤其是合并了荨麻疹，吼喘或相关环境暴露时。
            </p>
            <p>- 反复喘息发作也提示胃食道反流</p>
            <p>- 然而如果持续于上呼吸道感染反复喘息，提示活跃性的气道疾病</p>
            <p>
              -
              反复喘息或难治性哮喘应考虑囊性纤维化，纤毛不动综合征，反复吸入、免疫缺陷或解剖异常
            </p>
          </el-collapse-item>

          <el-collapse-item title="3. 喘息呈发作性还是持续性？" name="3">
            <p>
              持续性的喘息提示各种原因所致的机械性的梗阻，如气道异物，先天性的气道狭窄，或由于纵膈肿物或血管畸形造成的外压压外在压迫。
            </p>
          </el-collapse-item>
          <el-collapse-item title="4. 喘息发作前是否有噎塞或作呕？" name="4">
            <p>
              异物吸入有时表现为梗塞或是做好后突然出现症状，
              异物吸入最常见于1~4岁的儿童症状与异物的大小及位置有关，喘息可以是单侧的，可以继发细菌感染。
            </p>
          </el-collapse-item>
          <el-collapse-item title="5. 喘息前是否有上呼吸道感染？" name="5">
            <p>前驱的上呼吸道感染提示潜在的炎症或感染病因。</p>
          </el-collapse-item>
          <el-collapse-item title="6. 孩子的体重和身高怎样？" name="6">
            <p>提示囊性纤维化的临床特征，包括生长停滞，脂肪泻或反复感染。</p>
          </el-collapse-item>
          <el-collapse-item title="7. 是否有反复细菌感染的病史？" name="7">
            <p>
              囊性纤维化的患者常有反复呼吸道感染纤毛运动障碍者可有频繁咳嗽，鼻窦炎和中耳炎。
            </p>
          </el-collapse-item>
          <el-collapse-item
            title="8. 是否有早产史，或生后接受机械通气或长期用氧病史？"
            name="8"
          >
            <p>需考虑早产儿支气管肺发育不良慢性肺病。</p>
          </el-collapse-item>
          <el-collapse-item
            title="9. 是否存在过敏性黑眼圈、丹尼线、鼻皱褶或特异性皮炎？"
            name="9"
          >
            <p>特应性体质者更易患哮喘。</p>
          </el-collapse-item>
          <el-collapse-item title="10. 喂养时症状是否加重？" name="10">
            <p>应考虑胃食道反流和食管气管漏。</p>
          </el-collapse-item>
          <el-collapse-item title="11. 母亲孕期是否检测性传播疾病？" name="11">
            <p>
              沙眼支原体肺炎，可在出生后两个月出现症状，表现为非化脓性的结膜炎喘息和肺炎，不伴有发热。
            </p>
          </el-collapse-item>
          <el-collapse-item title="12. 是否有喘息或有哮喘的家族史？" name="12">
            <p>
              有哮喘病家族史，父母一方或双方患病子女患哮喘的风险就会较人群基础患病率增加2~3倍。
            </p>
          </el-collapse-item>
        </el-collapse>
      </div>
      <template #footer>
        <el-button @click="diaglogVisible = false">关闭</el-button>
      </template>
      <!-- <span slot="footer" class="clearfix">
        <el-button class="" @click="diaglogVisible = false">关闭</el-button>
      </span> -->
    </el-dialog>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        diaglogVisible: false,
        activeName: '1',
      }
    },
    methods: {},
  }
</script>
<style lang="scss" scoped>
  .cmp-differential-diagnosis {
    // float: right;
    // margin-right: 12px;
    // margin-left: 0px;
    .inline-block {
      display: inline-block;
      vertical-align: middle;
      overflow: hidden;
      line-height: 0;
    }
    .diagnostic-notice {
      font-size: 12px;
      margin-bottom: 6px;
    }
    .differential-diagnosis-dialog {
      .el-collapse-item__wrap {
        padding: 12px;
        border-radius: 4px;
        background-color: #eee;

        .el-collapse-item__content {
          padding-bottom: 0;

          p {
            margin: 0.5rem 0;
          }
        }
      }
    }
  }
</style>
<!-- <style scoped>

</style> -->
